define( [
		'module',
		'backbone',
		'marionette',
		'view/item',
		'text!templates/listView.html' 
		],
function( module, Backbone, Marionette, GridRow, ListHTML ) {
	console.log("Loading module " + module.id + " from " + module.uri + "...");

	var GridView = Backbone.Marionette.CompositeView.extend({
//		template: "#grid-template",
//		template: "#library-template",
		template: undefined,
		childView: GridRow,
		childViewContainer: 'div',
    
		/*
		attachHtml: function(collectionView, itemView) {
			debugger;
			collectionView.$("tbody").append(itemView.el);
		}
		*/

		initialize: function() {
			debugger;
			this.template = _.template(ListHTML)
			console.log("GridView: initialize - fetching collection");
			this.collection.fetch();
			console.log("GridView: initialize - collection fetched");

			this.listenTo( appCTX, 'image:processed', this.saveData );
		},

		onRender: function(){
    		// do stuff here
			console.log("ComponiteView: onRender event caught");
  		},

		saveData: function(formDataStr) {
			var fData = JSON.parse(formDataStr);
			console.log("processForm:" + formDataStr);
			this.collection.create(fData);
		},

		processForm: function(e) {
			/* This is dummy function that adds a fake content into database
			 * Complete handling happens within a View
			 */
			e.preventDefault();
			e.stopPropagation();
			console.log("CompositeView: processForm event caught");
			var formData = {
				coverImage:"img/placeholder.png",
				title:"My Picture",
				author:"Harial Rajan",
				releaseDate:"2010",
				keywords:"Kerala south india"
			};

			appCTX.trigger('image:processed', JSON.stringify(formData));
		},

		events: {
			"click #addNewBookBtn":"processForm"
		}
	});
	
	return GridView;
});
